<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="layui/css/layui.css" />

		<link rel="stylesheet" type="text/css" href="/static/kindeditor/themes/default/default.css" />
		<script charset="utf-8" src="/static/kindeditor/kindeditor-all.js"></script>
		<script charset="utf-8" src="/static/kindeditor/lang/zh-CN.js"></script>
		<script src="/bck/static/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<!-- <link rel="stylesheet" type="text/css" href="static/css/work/shangpin.css" />
		<script src="/static/js/work/shangpin.js" type="text/javascript" charset="UTF-8"></script> -->
		<script src="layui/layui.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			.div0-0 {
				height: 38px;
				line-height: 38px;
				padding: 0 18px;
				background-color: #009688;
				color: #fff;
				white-space: nowrap;
				text-align: center;
				font-size: 14px;
				border: none;
				border-radius: 2px;
				cursor: pointer;
			}

			#tj {
				display: none;
				position: fixed;
				top: 0px;
				left: 0px;
				width: 1920px;
				height: 910px;
				background: rgba(0, 0, 0, 0.3);
				color: #666;
			}

			#tj_1 {
				position: fixed;
				width: 732px;
				height: 882px;
				top: 23.5px;
				left: 750px;
				background: white;
			}

			#tj_1_1 {
				/*width: 100%;*/
				height: 50px;
				line-height: 50px;
				border: 0;
				background-color: #20222A;
				color: #fff;
				padding: 0 0px 0 20px;
			}

			#tj_1_2 {
				width: 420px;
				height: 700px;
				padding-left: 75px;
				padding-top: 24px;
			}

			#tjbtn {
				width: 64px;
				height: 38px;
				line-height: 38px;
				padding: 0 18px;
				background-color: #009688;
				color: #fff;
				white-space: nowrap;
				text-align: center;
				font-size: 14px;
				border: none;
				border-radius: 2px;
				cursor: pointer;
				margin-left: 130px;
			}

			.icon_false {
				display: inline-block;
				width: 14px;
				height: 2px;
				background: #fff;
				line-height: 0;
				font-size: 0;
				vertical-align: middle;
				-webkit-transform: rotate(45deg);
			}

			.icon_false:after {
				content: '/';
				display: block;
				width: 14px;
				height: 2px;
				background: #fff;
				-webkit-transform: rotate(-90deg);
			}


			#tab {
				border-width: 1px;
				border-style: solid;
				border-color: #e6e6e6;
				border-collapse: collapse;
				border-right: 1px solid #e6e6e6;
				border-bottom: 1px solid #e6e6e6;
				color: #666;
			}

			#tab th {
				text-align: left;
				width: 223px;
				height: 28px;
				line-height: 28px;
				padding: 5px 15px;
				font-weight: 400;
				background-color: #f2f2f2;
				border-left: 1px solid #e6e6e6;
				border-top: 1px solid #e6e6e6;
			}

			#tab td {
				width: 223px;
				text-align: left;
				padding: 10px;
				padding-left: 15px;
				border-left: 1px solid #e6e6e6;
				border-top: 1px solid #e6e6e6;
			}

			#tab tr:hover {
				background-color: #f2f2f2;
			}


			.del {
				width: 42px;
				height: 24px;
				border: 0px solid black;
				border-radius: 3px;
				color: #fff;
				background-color: #FF5722;
				font-size: 12px;
				font-weight: 400;
				cursor: pointer;
			}

			.update {
				width: 42px;
				height: 24px;
				border: 0px solid black;
				border-radius: 3px;
				color: #fff;
				background-color: #1E9FFF;
				font-size: 12px;
				font-weight: 400;
				margin-left: 4px;
				cursor: pointer;
			}
		</style>
	</head>
	<body>
		<!-- <button class="div0-0" id="ttjj"><a href="/shangpinadd.html"></a>添加</button> -->
		<div class="div0-0"><a href="/shangpinadd.html">添加</a></div>

		<!--添加-->
		<!-- <div id="tj">

			<div id="tj_1">
				<div id="tj_1_1">
					商品基本信息<div id="tj_1_1_1" style="display: inline-block; margin-left: 592px;cursor: pointer;"><i class="icon_false"></i></div>
				</div>
				<div id="tj_1_2">
					<div class="div1_1" style="margin-left: -14px;height: 38px;margin-bottom: 15px;">
						商品名称：<input id="name" type="text" class="input1" value="" placeholder="" style="margin-left: 17px;" />
					</div>
					<div class="div1_1" style="margin-left: 1px;height: 38px;margin-bottom: 15px;">
						价格：<input id="price" type="text" class="input1" value="" placeholder="" style="margin-left: 17px;" />
					</div>
					<div class="div1_1" style="height: 38px;margin-bottom: 15px;">所属品牌：
						<input id="brand" type="text" class="input1" value="" placeholder="" style="margin-left: 17px;" />
					</div>
					<div class="div1_1" style="height: 38px;margin-bottom: 15px;">所属分类：
						<input id="classify" type="text" class="input1" value="" placeholder="" style="margin-left: 17px;" />
					</div>
					<div class="div1_1" style="height: 38px;margin-bottom: 15px;">库存：
						<input id="inventory" type="text" class="input1" value="" placeholder="" style="margin-left: 17px;" />
					</div>
					<div class="div1_1" style="height: 38px;margin-bottom: 15px;">详情：
						<form action="" id="form" method="post">
							<textarea id="editor_id" name="content" style="width:700px;height:300px;">
									&lt;strong&gt;HTML内容&lt;/strong&gt;
							</textarea>
						</form>
					</div>
				</div>
				<div id="tj_1_3">
					<button id="tjbtn">确认</button>
				</div>
			</div>

		</div> -->

		<table id="tab">
			<!-- <th ><input type="checkbox"></th> -->
			<th>商品名称</th>
			<th>商城价/元</th>
			<th>图片</th>
			<th>分类</th>
			<th>品牌</th>
			<th>库存</th>
			<th>详情</th>
			<th>操作</th>
		</table>
		
		<div id="test1"></div>
		<script type="text/javascript">
			layui.use('laypage', function() {
				var laypage = layui.laypage;
				//执行一个laypage实例
				laypage.render({
					elem: 'test1', //注意，这里的 test1 是 ID，不用加 # 号
					count: 50 //数据总数，从服务端得到
				});
			});


			var editor;
			var arr = [
				'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste',
				'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
				'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
				'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
				'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
				'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
				'flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
				'anchor', 'link', 'unlink', '|', 'about'
			];
			KindEditor.ready(function(K) {
				editor = K.create('#editor_id', {
					width: '100px', //设置编辑器的宽
					height: '400px',
					//items:['undo', 'redo']	只出现两个undo	后退redo	前进按钮
					items: arr, //设置工具栏的按钮
					uploadJson: '/ajax.php?ajax=upload', //文件上传程序
					fileManagerJson: '/ajax.php?ajax=file_manager', //浏览服务器图片空间
					allowFileManager: true, //启用图片空间按钮
				});
			});
			$(document).ready(function() {

				$("#ttjj").click(function() { //添加
					$("#tj").css("display", "block");
					//$("#tj").css("z-index", "19891022");
				});

				/* $("#tjbtn").click(function() {
					$("#tj").css("display", "none");
					$.ajax({
						type:'post',
						url:'/shangpinadd.php',
						data:{
							name:$('#name').val(),
							price:$('#price').val(),
							classify:$('#classify').val(),
							brand:$('#brand').val(),
							inventory:$('#inventory').val(),
							particulars:editor.html(),
						},
						dataType:'json',
						success:function(mgs){
							console.log(mgs);
						}
					});	
				}); */
				$("#tj_1_1_1").click(function() {
					$("#tj").css("display", "none");
				});

				$.ajax({
					type: 'get',
					url: '/shangpin.php',
					data: {
						page: 1
					},
					dataType: 'json',
					success: function(mgs) {
						console.log(mgs.data);
						var data = mgs.data;
						for (var a in data) {
							var str = '<tr>';
							for (var a1 in data[a]) {
								if (a1 == 'lb') {
									//str+='<td><img src"'+data[a][a1]+'"></td>';
									str += '<td><img style="widht:200px;height:60px;" src="upload/img/1588163690.png" ></td>';
								} else if (a1 != 'uid') {
									str += '<td>' + data[a][a1] + '</td>';
								}
							}
							str += '<td style="text-align: center;"><button class="del" name="del" uid=' + data[a]['uid'] +
								'>删除</button><button class="update"  name="update" uid="' + data[a]['uid'] +
								'">编辑</button></td></tr>';

							$('#tab').append(str);
						}
						$('.del').click(function() { //删除
							var btn_this = $(this);
							$.ajax({
								type: "post",
								url: "/shangpindelete.php",
								data: {
									uid: $(this).attr('uid')
								},
								success: function(mgs) {
									btn_this.parent().parent().remove();
								}
							});
						});
					}
				});
				/*  */


			});
		</script>
	</body>
</html>
